<template>
    <div class="hospital">
        <div >
            <ul>
                <li v-for="i in listinfo" :key="i.id" v-if="i.dortor!==1">
                    <img :src="i.img" alt="">
                    <p>{{i.hospital}}</p>
                    <p>{{i.city}}</p>
                    <div style="clear: both"></div>
                </li>
            </ul>
        </div>
        <div class="doctor">
            <ul>
                <li v-for="i in listinfo" :key="i.id" v-if="i.dortor===1">
                    <img :src="i.img" alt="">
                    <p>{{i.name}}</p>
                    <p>{{i.hospital}}</p>
                    <p>{{i.city}}</p>
                    <div style="clear: both"></div>
                </li>
            </ul>
        </div>

  <div style="clear: both"></div>
    </div>
</template>

<script>
    export default {
        name: "Hospital",
        props:['listinfo']
    }
</script>

<style scoped lang="less">
    .hospital{
        ul{
            li{
                background-color: #f6f6f6;
                border-radius: 4px;
                height: auto;
                padding: 19px 0 19px 16px;
                margin-bottom: 2px;
                img{
                    width: 64px;
                    height: 64px;
                    border-radius: 50%;
                    float: left;

                }
                p{
                    color: #fe546f;
                    font-size: 16px;
                    float: left;
                    width: 73%;
                    padding-left: 10px;
                    padding-top: 15px;
                }
                >:nth-child(3){
                    padding-top:0px;
                    font-size: 12px;
                    color: #999999;
                }
            }
        }
        .doctor{
            ul{
                li{
                    p{
                        padding-top: 0;
                    }
                    >:nth-child(3){
                        font-size: 14px;
                        color: #333333;
                    }
                    >:nth-child(4){
                        font-size: 12px;
                        color: #999999;
                    }
                }
            }

        }
    }

</style>